<html>
<head>
    <style>
        .fn__clear > div {
            float: left;
            width: 250px;
            text-align: center;
            margin-bottom: 20px;
        }

        svg {
            display: block;
            height: 20px;
            width: 20px;
            margin: 0 auto;
        }

        .fn__clear:before, .fn__clear:after {
            display: table;
            content: "";
        }

        .fn__clear:after {
            clear: both;
        }
    </style>
</head>
<body>
<h2>Vditor</h2>
<div class="fn__clear">
    <div>
        <svg>
            <use xlink:href="#vditor-icon-comment"></use>
        </svg>
        vditor-icon-comment
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-mp-wechat"></use>
        </svg>
        vditor-icon-mp-wechat
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-code-theme"></use>
        </svg>
        vditor-icon-code-theme
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-quote"></use>
        </svg>
        vditor-icon-quote
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-after"></use>
        </svg>
        vditor-icon-after
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-before"></use>
        </svg>
        vditor-icon-before
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-headings"></use>
        </svg>
        vditor-icon-headings
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-line"></use>
        </svg>
        vditor-icon-line
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-code"></use>
        </svg>
        vditor-icon-code
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-inline-code"></use>
        </svg>
        vditor-icon-inline-code
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-both"></use>
        </svg>
        vditor-icon-both
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-theme"></use>
        </svg>
        vditor-icon-theme
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-resize"></use>
        </svg>
        vditor-icon-resize
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-export"></use>
        </svg>
        vditor-icon-export
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-copy"></use>
        </svg>
        vditor-icon-copy
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-pause"></use>
        </svg>
        vditor-icon-pause
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-preview"></use>
        </svg>
        vditor-icon-preview
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-edit"></use>
        </svg>
        vditor-icon-edit
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-info"></use>
        </svg>
        vditor-icon-info
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-help"></use>
        </svg>
        vditor-icon-help
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-strike"></use>
        </svg>
        vditor-icon-strike
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-contract"></use>
        </svg>
        vditor-icon-contract
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-record"></use>
        </svg>
        vditor-icon-record
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-bold"></use>
        </svg>
        vditor-icon-bold
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-bug"></use>
        </svg>
        vditor-icon-bug
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-play"></use>
        </svg>
        vditor-icon-play
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-check"></use>
        </svg>
        vditor-icon-check
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-upload"></use>
        </svg>
        vditor-icon-upload
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-trashcan"></use>
        </svg>
        vditor-icon-trashcan
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-more"></use>
        </svg>
        vditor-icon-more
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-fullscreen"></use>
        </svg>
        vditor-icon-fullscreen
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-emoji"></use>
        </svg>
        vditor-icon-emoji
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-align-center"></use>
        </svg>
        vditor-icon-align-center
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-align-left"></use>
        </svg>
        vditor-icon-align-left
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-align-right"></use>
        </svg>
        vditor-icon-align-right
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-delete-column"></use>
        </svg>
        vditor-icon-delete-column
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-delete-row"></use>
        </svg>
        vditor-icon-delete-row
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-down"></use>
        </svg>
        vditor-icon-down
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-insert-row"></use>
        </svg>
        vditor-icon-insert-row
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-insert-column"></use>
        </svg>
        vditor-icon-insert-column
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-insert-rowb"></use>
        </svg>
        vditor-icon-insert-rowb
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-insert-columnb"></use>
        </svg>
        vditor-icon-insert-columnb
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-italic"></use>
        </svg>
        vditor-icon-italic
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-link"></use>
        </svg>
        vditor-icon-link
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-outdent"></use>
        </svg>
        vditor-icon-outdent
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-indent"></use>
        </svg>
        vditor-icon-indent
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-ordered-list"></use>
        </svg>
        vditor-icon-ordered-list
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-redo"></use>
        </svg>
        vditor-icon-redo
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-table"></use>
        </svg>
        vditor-icon-table
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-undo"></use>
        </svg>
        vditor-icon-undo
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-list"></use>
        </svg>
        vditor-icon-list
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-up"></use>
        </svg>
        vditor-icon-up
    </div>
    <div>
        <svg>
            <use xlink:href="#vditor-icon-zhihu"></use>
        </svg>
        vditor-icon-zhihu
    </div>
</div>
<script src="../src/js/icons/ant.js"></script>
</body>
</html>
